<template>
    <div class="tabbar">
        <div class="tabbar_container" v-for="(v,i) in TabBarMenu" :key="i" @click="e_selectbar(v.id,v.path,v.title)">
            <img class="tabbar_icon" :src='tabSelectID == v.id?v.iconSel:v.icon'>
            <span class="tabbar_title" :class="{tabbar_titlesel:tabSelectID == v.id}" v-text="v.title" />
        </div>

    </div>
</template>

<script>
import { TabBarMenu } from './tabMenu'
import { mapState, mapMutations } from 'vuex'
export default {
	name: 'tabbar',
	data() {
		return {
			TabBarMenu,
		}
	},

	components: {},

	computed: {
		...mapState(['wtitle', 'tabSelectID']),
	},

	methods: {
		...mapMutations(['WTITLE', 'TABSELECTID']),
		// 选中Tab
		e_selectbar(id, p, t) {
		  console.log(id)
		  console.log(t)
			sessionStorage.setItem('tabSelectID', id)
			this.TABSELECTID(id) //更新底部导航的选中ID
			this.$router.push(p)
			this.WTITLE(t)
		},
	},

	mounted() {},
}
</script>
